<template>
  <div class="dashboard-container">
    <el-table
      :data="listData"
      style="width: 100%">
      <el-table-column
        prop="opinion_id"
        label="反馈编号"
        width="180">
      </el-table-column>
      <el-table-column
        prop="user_id"
        label="用户id"
        width="180">
      </el-table-column>
      <el-table-column
        prop="content"
        label="内容"
        width="180">
      </el-table-column>
      <el-table-column
        prop="create_time"
        label="创建时间"
        width="200">
      </el-table-column>
      <el-table-column
        label="操作"
        width="200">
        <template slot-scope="scope">
          <el-button
            size="mini"
            type="danger"
            @click="Delete(scope.row.opinion_id,scope.$index)">已读,并删除
          </el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
import { mapGetters } from 'vuex'
import {getOpinions,deleteOpinion} from '../../api/static'

export default {
  name: 'Dashboard',
  data(){
    return {
      listData:[],
      showBox:false,
      BoxData:{},
    }
  },
  computed: {
    ...mapGetters([
      'name'
    ])
  },
  created(){
    getOpinions().then(res=>{
      console.log(res.data)
      this.listData = res.data
    })
  },
  methods: {
      Delete(opinion_id,index) {
        deleteOpinion(opinion_id).then(res=>{
          this.listData.splice(index,1)
        })
      },
    }
}
</script>

<style lang="scss" scoped>
.dashboard {
  &-container {
    margin: 30px;
  }
  &-text {
    font-size: 30px;
    line-height: 46px;
  }
}
</style>
